.grid-toggler-icon-valid {
  color: #78d07d;
  cursor: pointer;
}

.grid-toggler-icon-not-valid {
  color: #c05c67;
  cursor: pointer;
}

table.grid-ordering-column tr {
  transition-timing-function: ease-out;
  transition-duration: 0.2s;
  transition-property: all;
  &.hover {
    background-color: $gray-soft;
  }
  &:hover {
    .position-drag-handle {
      visibility: visible;
    }
  }
}

table.grid-ordering-column tr.position-row-while-drag {
  color: #fff;
  background: none;
  box-shadow: 3px 3px 8px 0 rgba(0, 0, 0, 0.2);
  transform: translate(5px, 10px);
  td {
    background-color: $medium-gray;
  }
  td:first-child {
    @include border-left-radius(3px);
  }
  td:last-child {
    @include border-right-radius(3px);
  }

  .position-drag-handle,
  .position-drag-handle:hover,
  .btn,
  .btn::after,
  .btn .material-icons {
    color: #fff;
  }
}

.js-drag-handle {
  cursor: move;
}

.position-drag-handle {
  color: $gray-medium;
  visibility: hidden;

  &:hover {
    color: $primary;
  }
}

.btn-group-action {
  a.dropdown-toggle,
  button.dropdown-toggle,
  .dropdown-toggle {
    color: $gray-medium;
    &::after {
      content: "more_vert";
    }

    &:hover {
      color: $primary;
    }
  }
}

table .thead-default .column-headers th:last-child .grid-actions-header-text {
  float: right;

  span {
    padding-right: 14px;
  }
}

table .column-filters td:last-child .grid-search-button,
table .column-filters td:last-child .grid-reset-button {
  float: right;
}

.grid {
  table.grid-table {
    thead {
      tr {
        td {
          .min-field,
          .max-field {
            display: inline-block;
            width: 60px;
          }
          .md-checkbox {
            &:not(:last-child) {
              display: inline-block;
            }
            & ~ .form-control {
              display: inline-block;
              /* stylelint-disable-next-line */
              width: calc(100% - 29px);
            }
          }
        }
      }
    }
    tbody {
      tr {
        $tr: &;

        &:hover {
          background: #fafbfc;
        }

        &.preview-row,
        &.empty_row {
          background: inherit;
        }

        &.preview-open {
          background-color: #e9f8fb;
        }

        // styling for row that is being dragged
        &.dragging-row {
          cursor: move;
          background: #fafbfc;

          td {
            color: #fff;
            background: #67868e;
            transform: translate(5px, 10px);

            // make all icons and links white
            i.grid-toggler-icon-valid,
            i.grid-toggler-icon-not-valid,
            i.material-icons,
            a,
            a::after {
              color: #fff;
            }
          }
        }

        // ---------------------------------
        // Styling for specific column types
        // ---------------------------------
        td {
          word-break: break-word;

          &.draggable-type {
            .draggable-column {
              color: transparent;
              cursor: move;
            }

            @at-root {
              #{$tr}:hover .draggable-column {
                /* stylelint-disable declaration-no-important */
                color: #15b7d7 !important;
                /* stylelint-enable declaration-no-important */
              }
            }
          }

          &.choice-type {
            @mixin display-dropdown-arrow() {
              &::after {
                width: 20px;
                visibility: visible;
              }
            }

            .dropdown {
              .dropdown-toggle {
                padding: 0 5px;
                margin-right: 20px;
                @include transition(0.2s ease-out);

                &:hover {
                  margin-right: 0;
                  @include display-dropdown-arrow();
                }
                &.coloured {
                  border: 0;
                }

                &::after {
                  width: 0;
                  visibility: hidden;
                  @include transition(0.2s ease-out);
                }
              }

              &.show {
                .dropdown-toggle {
                  margin-right: 20px;
                  @include transition(0.2s ease-out);

                  &:hover {
                    margin-right: 0;
                  }

                  @include display-dropdown-arrow();
                }
              }

              .dropdown-menu {
                .dropdown-item {
                  cursor: pointer;
                }
              }
            }
          }

          &.action-type {
            .inline-dropdown-item {
              &:only-child {
                margin-left: auto;
              }

              width: inherit;
            }

            .btn-group > .dropdown-item {
              &:hover,
              &:focus {
                background-color: transparent;
              }
            }
          }

          &.order_price-type {
            .badge {
              padding: 5px;
              font-size: 100%;
              font-weight: 600;
            }
          }

          &.date_time-type {
            word-break: normal;
          }
        }
      }
    }
  }
  .table-responsive .row {
    margin: 0;
  }
  .preview-toggle {
    i:hover {
      cursor: pointer;
    }
  }
}
